<template>
	<div class="cp-counter">
		<a href="javascript:void(0)" v-on:click.stop="minus">-</a>
		<input type="text" name="" v-bind:value="num">
		<a href="javascript:void(0)" v-on:click.stop="plus">+</a>
	</div>
</template>
<style type="text/css">
	.cp-counter{
		display: inline-block;
		border: 1px solid #a3a2a2;
		border-radius: 5px;
	}
	.cp-counter a{
		padding: 8px;
		color: #666;
		float: none!important;
	}
	.cp-counter input{
		width: 30px;
		height: 23px;
		text-align: center;
		border: none;
		border-left: 1px solid #a3a2a2;
		border-right: 1px solid #a3a2a2;
	}
</style>
<script type="text/javascript">
		export default {
		data(){	
			return {
				num:1,
			}
		},
		methods:{
			minus:function(){
				if(this.num==1){ return}
				this.num--;
				this.$parent.changeNum(this.num);
			},
			plus:function(){
				this.num++;
				this.$parent.changeNum(this.num);
			},
		}
	}
</script>